﻿@inherits LayoutComponentBase
@using Blazored.LocalStorage;
@using BootstrapBlazor.Components
@using System.Diagnostics.CodeAnalysis;
@inject NavigationManager nav
@inject MessageService msg
@inject ILocalStorageService local

<Global></Global>
<Layout SideWidth="0" IsPage="true" ShowFooter="false" ShowGotoTop="true" ShowCollapseBar="true"
            IsFullSide="@IsFullSide" IsFixedHeader="@IsFixedHeader" IsFixedFooter="@IsFixedFooter"
            TabDefaultUrl="/"
            Menus="@Menus" UseTabSet="@UseTabSet" AdditionalAssemblies="new[] { GetType().Assembly }" class="@Theme">
        <Header>
            <span class="ms-3 flex-sm-fill d-none d-sm-block"></span>
            <div class="flex-fill d-sm-none">
            </div>
        <Logout ImageUrl="@currentUser.Avatar" DisplayName="@currentUser.UserName" UserName="@currentUser.Account">
                <LinkTemplate>
                    @*<a href="#"><i class="fa-solid fa-suitcase"></i>个人中心</a>*@
                    <LogoutLink />
                </LinkTemplate>
            </Logout>

            <div class="layout-drawer" @onclick="@(e => IsOpen = !IsOpen)"><i class="fa fa-gears"></i></div>
        </Header>
        <Side>
            <div class="layout-banner">
                <div class="layout-title">
                    <span>项目管理</span>
                </div>
            </div>
        </Side>
        <Main>
            <CascadingValue Value="this" IsFixed="true">
                @Body
            </CascadingValue>
        </Main>
        <NotFound>
            <p>抱歉，地址无效！.</p>
        </NotFound>
    </Layout>
<Drawer Placement="Placement.Right" @bind-IsOpen="@IsOpen" IsBackdrop="true">
        <div class="layout-drawer-body">
            <div class="btn btn-info w-100" @onclick="@(e => IsOpen = false)">点击关闭</div>
            <div class="page-layout-demo-option">
                <p>布局调整</p>
                <div class="row">
                    <div class="col-6">
                        <div class="layout-item @(IsFullSide ? "active d-flex" : "d-flex")" @onclick="@(e => IsFullSide = true)" data-toggle="tooltip" title="左右结构">
                            <div class="layout-left d-flex flex-column">
                                <div class="layout-left-header"></div>
                                <div class="layout-left-body flex-fill"></div>
                            </div>
                            <div class="layout-right d-flex flex-column flex-fill">
                                <div class="layout-right-header"></div>
                                <div class="layout-right-body flex-fill"></div>
                                <div class="layout-right-footer"></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-6">
                        <div class="layout-item flex-column @(IsFullSide ? "d-flex" : "active d-flex")" @onclick="@(e => IsFullSide = false)" data-toggle="tooltip" title="上下结构">
                            <div class="layout-top">
                            </div>
                            <div class="layout-body d-flex flex-fill">
                                <div class="layout-left">
                                </div>
                                <div class="layout-right flex-fill">
                                </div>
                            </div>
                            <div class="layout-footer">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            @*        <div class="page-layout-demo-option">
            <p>主题配色</p>
            <div class="row">
            <div class="col-2">
            <span class="color color1" @onclick="@(e => Theme = "color1")"></span>
            </div>
            <div class="col-2">
            <span class="color color2" @onclick="@(e => Theme = "color2")"></span>
            </div>
            <div class="col-2">
            <span class="color color3" @onclick="@(e => Theme = "color3")"></span>
            </div>
            <div class="col-2">
            <span class="color color4" @onclick="@(e => Theme = "color4")"></span>
            </div>
            <div class="col-2">
            <span class="color color5" @onclick="@(e => Theme = "color5")"></span>
            </div>
            <div class="col-2">
            <span class="color color6" @onclick="@(e => Theme = "color6")"></span>
            </div>
            </div>
            </div>*@

            <div class="page-layout-demo-option">
                <p>更多设置</p>
                <div class="row">
                    <div class="col-6 d-flex align-items-center">
                        <Switch @bind-Value="@UseTabSet" OnColor="@Color.Success" OffColor="@Color.Primary"></Switch>
                    </div>
                    <div class="col-6 text-right">
                        <span class="cell-label">@(UseTabSet ? "多标签" : "单页")</span>
                    </div>
                </div>
            </div>
        </div>
    </Drawer>



